<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>乐购电子商城-产品列表页面</title>
    <!-- 引入公共样式  -->
    <link rel="stylesheet" href="./css/normalize.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./lunbo/css/slider.css">
    <script src="./lunbo/lib/jquery.min.js"></script>
    <!-- <script src="../legou/lunbo/js/index.js"></script> -->
    <script src="./lunbo/lib/jquery.slidebox.js"></script>
    <!-- 引入当前文件样式  -->
    <link rel="stylesheet" href="./css/Shopping Cart.css">

</head>

<body>
    <!-- 头部通栏 -->
    <div class="tonglan container-fluid">
        <div class="clearfix">
            <div class="container">
                <div class="logo fl">
                    <img src="./img/04-购物车_02.jpg" alt="">
                </div>
                <span class="wangzhi fl">legochina.cn</span>
                <span class="denglu fr">请 登录\<a href="">注册</a></span>
                <span class="fr">欢迎光临<a href="">乐购</a>,</span>
            </div>
        </div>
    </div>
    <!-- 头部 -->
    <div class="toubu container">
        <div class="zhuangtai  clearfix">
            <div class="sousuokuang fr">
                <input class="fl" type="text" placeholder="创意文具">
                <button class="fr"></button>
            </div>
            <p class="xuanze">
                配送至:
                <select>
                    <option value="">成都高新区三环内</option>
                    <option value="">成都武侯区天府新谷</option>
                    <option value="">成都天府广场</option>
                </select>
            </p>
        </div>
    </div>

    <!-- 购物车 -->
    <div class="header container">
        <!-- 头部 -->
        <ul class="list_header">
            <li class="list_chk">
                <!-- <input type="checkbox" id="selall">  -->
                <div class="shop_info">
                    <!-- 单个店铺的全选 -->
                    <input type="checkbox" class="all_check ">

                </div>
            </li>
            <li class="list_con">全选</li>
            <li class="list_info">商品</li>
            <li class="list_price">单价</li>
            <li class="list_amount">数量</li>

            <li class="list_sum">小计</li>
            <li class="list_op">操作</li>
        </ul>
        <!-- 第一个店铺 -->
        <div class="cartbox">
            <!-- 店铺信息 -->
            <div class="fgx">
                    
            </div>
            <!-- 订单主要区域 -->
            <div class="order_content">
                <ul class="order_lists mt10 clearfix">
                    <li class="list_chk">
                        <!-- 单个复选框 -->
                        <input type="checkbox" class="son_check">
                    </li>
                    <li class="list_con">
                        <div class="list_img fl">
                            <a href="javascript:;">
                                <img src="./img/index08_05.jpg" alt="">
                            </a>
                        </div>                     
                    </li>
                    <li class="list_info">
                        <p>从你的全世界路过</p>
                        
                    </li>
                    <li class="list_price">
                        <!-- 单价 -->
                        <p class="price">￥<span>500</span></p>
                    </li>
                    <!-- 数量  -->
                    <li class="list_amount">
                        <div class="amount_box">
                            <!-- 减 -->
                            <a class="reduce fl">-</a>
                            <input type="number" value="1" class="sum fl">
                            <!--  加 -->
                            <a class="plus fl">+</a>
                        </div>
                    </li>
                    <li class="list_sum">
                        <!-- 小计结果 -->
                        <p class="sum_price">￥<span>500</span></p>
                    </li>
                    <li class="list_op">
                        <p class="del">
                            <a class="delbtn">移除商品</a>
                        </p>
                    </li>
                </ul>
                <ul class="order_lists mt10 clearfix">
                    <li class="list_chk">
                        <!-- 单个复选框 -->
                        <input type="checkbox" class="son_check">
                    </li>
                    <li class="list_con">
                        <div class="list_img fl">
                            <a href="javascript:;">
                                <img src="./img/index08_05.jpg" alt="">
                            </a>
                        </div>                     
                    </li>
                    <li class="list_info">
                        <p>从你的全世界路过</p>
                        
                    </li>
                    <li class="list_price">
                        <!-- 单价 -->
                        <p class="price">￥<span>500</span></p>
                    </li>
                    <!-- 数量  -->
                    <li class="list_amount">
                        <div class="amount_box">
                            <!-- 减 -->
                            <a class="reduce fl">-</a>
                            <input type="number" value="1" class="sum fl">
                            <!--  加 -->
                            <a class="plus fl">+</a>
                        </div>
                    </li>
                    <li class="list_sum">
                        <!-- 小计结果 -->
                        <p class="sum_price">￥<span>500</span></p>
                    </li>
                    <li class="list_op">
                        <p class="del">
                            <a class="delbtn">移除商品</a>
                        </p>
                    </li>
                </ul>
                <ul class="order_lists mt10 clearfix">
                    <li class="list_chk">
                        <!-- 单个复选框 -->
                        <input type="checkbox" class="son_check">
                    </li>
                    <li class="list_con">
                        <div class="list_img fl">
                            <a href="javascript:;">
                                <img src="./img/index08_05.jpg" alt="">
                            </a>
                        </div>                     
                    </li>
                    <li class="list_info">
                        <p>从你的全世界路过</p>
                        
                    </li>
                    <li class="list_price">
                        <!-- 单价 -->
                        <p class="price">￥<span>500</span></p>
                    </li>
                    <!-- 数量  -->
                    <li class="list_amount">
                        <div class="amount_box">
                            <!-- 减 -->
                            <a class="reduce fl">-</a>
                            <input type="number" value="1" class="sum fl">
                            <!--  加 -->
                            <a class="plus fl">+</a>
                        </div>
                    </li>
                    <li class="list_sum">
                        <!-- 小计结果 -->
                        <p class="sum_price">￥<span>500</span></p>
                    </li>
                    <li class="list_op">
                        <p class="del">
                            <a class="delbtn">移除商品</a>
                        </p>
                    </li>
                </ul>
                
            </div>
        </div>



        <!-- 底部 -->
        <div class="btmbox">

            <!-- <input type="checkbox" class="all_check ml30">
            <span>全选</span>  -->
            <a class="delallsel">删除选中商品</a>
            <p class="fr">
                <span>已选择<strong class="cf40 amount">0</strong>件商品</span>
                <span>共计<strong class="cf40 totalprice">0.00</strong>元</span>
                <a href="#">去结算</a>
            </p>


        </div>
    </div>




    <!-- 猜你喜欢 -->
    <div class="popularitem container">
        <p class="biaoti">
            <span>猜你喜欢</span>
        </p>
        <ul class="commoditybox clearfix">
            <li class="commodity fl">
                <img class="tupian" src="./素材图片/书籍/22935553-1_l.jpg" alt="">
                <img class="zhekou" src="./img/促销标签.png" alt="">
                <p class="jiesao">
                    白夜行 东野上吾
                </p>
                <p class="tuijian">
                    <span>推荐</span>
                    <img src="./img/XX.png" alt="">
                </p>
                <p class="jiage">
                    <span class="xianjia">￥:38</span>
                    <del class="yuanjia">￥:58</del>
                </p>
            </li>
            <li class="commodity fl">
                <img class="tupian" src="./素材图片/书籍/22935553-1_l.jpg" alt="">
                <img class="zhekou" src="./img/促销标签.png" alt="">
                <p class="jiesao">
                    白夜行 东野上吾
                </p>
                <p class="tuijian">
                    <span>推荐</span>
                    <img src="./img/XX.png" alt="">
                </p>
                <p class="jiage">
                    <span class="xianjia">￥:38</span>
                    <del class="yuanjia">￥:58</del>
                </p>
            </li>
            <li class="commodity fl">
                <img class="tupian" src="./素材图片/书籍/22935553-1_l.jpg" alt="">
                <img class="zhekou" src="./img/促销标签.png" alt="">
                <p class="jiesao">
                    白夜行 东野上吾
                </p>
                <p class="tuijian">
                    <span>推荐</span>
                    <img src="./img/XX.png" alt="">
                </p>
                <p class="jiage">
                    <span class="xianjia">￥:38</span>
                    <del class="yuanjia">￥:58</del>
                </p>
            </li>
            <li class="commodity fl">
                <img class="tupian" src="./素材图片/书籍/22935553-1_l.jpg" alt="">
                <img class="zhekou" src="./img/促销标签.png" alt="">
                <p class="jiesao">
                    白夜行 东野上吾
                </p>
                <p class="tuijian">
                    <span>推荐</span>
                    <img src="./img/XX.png" alt="">
                </p>
                <p class="jiage">
                    <span class="xianjia">￥:38</span>
                    <del class="yuanjia">￥:58</del>
                </p>
            </li>
            <li class="commodity fl">
                <img class="tupian" src="./素材图片/书籍/22935553-1_l.jpg" alt="">
                <img class="zhekou" src="./img/促销标签.png" alt="">
                <p class="jiesao">
                    白夜行 东野上吾
                </p>
                <p class="tuijian">
                    <span>推荐</span>
                    <img src="./img/XX.png" alt="">
                </p>
                <p class="jiage">
                    <span class="xianjia">￥:38</span>
                    <del class="yuanjia">￥:58</del>
                </p>
            </li>

        </ul>
    </div>



    <!-- 魔兽世界2 -->
    <div class="moshou bd container">
        <img src="./img/202.png" alt="">
    </div>

    <!-- 尾部 -->
    <div class="foottonglan container-fluid">
        <div class="foottong  container">
            <img src="./img/222_11.png" alt="">
            <img src="./img/222_13(1).png" alt="">
            <img src="./img/222_15.png" alt="">
            <img src="./img/222_17.png" alt="">
        </div>
    </div>
    <div class="foot container">
        <ul class="clearfix">
            <li class="fl">
                <h3>购物指南</h3>
                <a class="lianjie" href="#">购物流程</a>
                <a class="lianjie" href="#">发票制度</a>
                <a class="lianjie" href="#">账户管理</a>
                <a class="lianjie" href="#">会员优惠</a>
            </li>
            <li class="fl">
                <h3>支付方式</h3>
                <a class="lianjie" href="#">货到付款</a>
                <a class="lianjie" href="#">网上支付</a>
                <a class="lianjie" href="#">礼品卡支付</a>
                <a class="lianjie" href="#">银行转账</a>
            </li>
            <li class="fl">
                <h3>订单服务</h3>
                <a class="lianjie" href="#">订单配送查询</a>
                <a class="lianjie" href="#">订单状态查询</a>
                <a class="lianjie" href="#">自助取消订单</a>
                <a class="lianjie" href="#">自助修改订单</a>
            </li>
            <li class="fl">
                <h3>退换货</h3>
                <a class="lianjie" href="#">退换货政策</a>
                <a class="lianjie" href="#">自助申请退换货</a>
                <a class="lianjie" href="#">退换货进度查询</a>
                <a class="lianjie" href="#">退款方式和时间</a>
            </li>
            <li class="fl">
                <h3>商家服务</h3>
                <a class="lianjie" href="#">商家中心</a>
                <a class="lianjie" href="#">运营服务</a>
                <a class="lianjie" href="#">加入唯品会</a>
            </li>
            <img src="./img/logo_00.png" alt="">
        </ul>
        <p class="jieshao">
            <a class="jieshaodao" href="#">公司简介 |</a>
            <a class="jieshaodao" href="#">Investor Relations |</a>
            <a class="jieshaodao" href="#">网站联盟 |</a>
            <a class="jieshaodao" href="#">乐购招商 |</a>
            <a class="jieshaodao" href="#">机构销售 |</a>
            <a class="jieshaodao" href="#">手机乐购 |</a>
            <a class="jieshaodao" href="#">官方Blog |</a>
            <a class="jieshaodao" href="#">热词搜索</a>
        </p>
        <p class="xinxi">
            Copyright (C) 乐购网 2004-2016, All Rights Reserved
        </p>
    </div>
    <!-- 引入公共js -->
    <script src="./js/common.js"></script>
    <!-- 引入当前文件的js -->
    <script src="./js/Shopping Cart.js"></script>

</body>

</html>